<template>
  <div class="EmergencyList">
    <div class="flex location-wrap">
      <span class="white">当前位置：</span>
      <el-breadcrumb separator="/">
        <el-breadcrumb-item :to="{ path: '/EDManagement' }">应急处置</el-breadcrumb-item>
        <el-breadcrumb-item>响应研判</el-breadcrumb-item>
      </el-breadcrumb>
    </div>
    <div class="box">
      <!-- 列表筛选 -->
      <filterTitle @query="query" @reset="reset" :form="form" :formData="formData">
      </filterTitle>
      <!-- 列表表格 -->
      <LsdTable slot="gjxm" @select="handleSelectionChange" :paginationAtrrs="paginationAtrrs"
        @pageChange="handleSizeChange" :compRef="table.compRef" ref="gjxm" :columns="table.columns" :title="table.title"
        :actions="table.actions" :tableData="table.tableData" :tableAttr="table.tableAttr" :isShowPage="table.isShowPage"
        :isSelectFlag="table.isSelectFlag" :isSequenceFlag="table.isSequenceFlag" @onActionClick="onActionClick" />
    </div>
    <!-- 弹窗信息 -->
    <LsdDialog :dialogConfig="dialogConfig" @handleBtn="handleBtn" @close="close" :class="type == 3 ? 'hide-xing' : ''"
      ref="yanpan_dialog">
      <LsdDialogTitle slot="dialog" :titleConfig="titleConfig" :activeNames="activeNames">
        <DialogForm ref="evenFormComponent" slot="slot1" :formConfig="evenFormConfig"
          @changeEvent="eventChangeSelected" />
        <el-descriptions slot="slot1"
          :labelStyle="{ display: 'inline-block', width: '130px', 'text-align': 'right', 'padding-right': '0px', 'margin-right': '0', 'box-sizing': 'border-box' }"
          :column="2" :colon="false">
          <el-descriptions-item label="事件类别：">{{ eventDataForm.eventName || '' }}</el-descriptions-item>
          <el-descriptions-item label="事件级别：">{{ eventDataForm.eventLvName || '' }}</el-descriptions-item>
          <el-descriptions-item label="影响范围：">{{ eventDataForm.effectRange || '' }}</el-descriptions-item>
          <el-descriptions-item label="发生时间：">{{ eventDataForm.occurrenceTime || '' }}</el-descriptions-item>
          <el-descriptions-item label="事件概要：" span="2">{{ eventDataForm.incidentOutline || '' }}</el-descriptions-item>
          <el-descriptions-item label="" v-for="(item) in selected_events" :key="item.value">
            <router-link tag="p" class="to-event-link" :to="`/EmergencyDetail?id=${item.value}`">{{ item.label }}
            </router-link>
          </el-descriptions-item>
        </el-descriptions>
        <!-- 灾情信息 -->
        <LsdTable slot="slot2" :compRef="disasterInfoConfig.compRef" :columns="disasterInfoConfig.columns"
          :actions="disasterInfoConfig.actions" :tableData="disasterInfoConfig.tableData"
          :tableAttr="disasterInfoConfig.tableAttr" :isShowPage="disasterInfoConfig.isShowPage"
          :isSelectFlag="disasterInfoConfig.isSelectFlag" :isSequenceFlag="disasterInfoConfig.isSequenceFlag" />
        <!-- 研判标准 -->
        <LsdTable slot="slot3" :compRef="yanpan_table.compRef" ref="gjxm" :columns="yanpan_table.columns"
          :title="yanpan_table.title" :actions="yanpan_table.actions" :tableData="yanpan_table.tableData"
          :tableAttr="yanpan_table.tableAttr" :isShowPage="yanpan_table.isShowPage"
          :isSelectFlag="yanpan_table.isSelectFlag" :isSequenceFlag="yanpan_table.isSequenceFlag" />
        <!-- 研判结果 -->
        <DialogForm ref="yanpanFormComponent" @handleNodeClick="handleNodeClick" slot="slot4"
          :formConfig="yanpanFormConfig" @changeEvent="yanpanrenChangeSelected" />
        <!-- 填报人 -->
        <DialogForm ref="createFormComponent" slot="slot5" :formConfig="createFormConfig" />
        <!-- 审批人 -->
        <DialogForm ref="approverFormComponent" slot="slot6" :formConfig="approverFormConfig" v-show="type == 3" />
      </LsdDialogTitle>
    </LsdDialog>
    <!-- 弹窗信息研判结果 -->
    <LsdDialog :dialogConfig="dialogConfig1" @handleBtn="handleBtn1" class="yanpan-jieguo" @close="closeYanpanResDialog">
      <LsdDialogTitle slot="dialog" :titleConfig="titleConfig1" :activeNames="activeNames1">
        <el-descriptions slot="slot1"
          :labelStyle="{ display: 'inline-block', width: '140px', 'text-align': 'right', 'padding-right': '12px', 'margin-right': '0', 'box-sizing': 'border-box' }"
          :column="2" :colon="false">
          <el-descriptions-item label="响应研判单：">{{ eventDataForm2.judgeName }}</el-descriptions-item>
          <el-descriptions-item label="是否启动响应：">{{ eventDataForm2.isResponse == "0" ? "否" : "是" }}
          </el-descriptions-item>
          <el-descriptions-item label="事件类别：">{{ eventDataForm2.eventName || '' }}</el-descriptions-item>
          <el-descriptions-item label="响应级别：">{{ eventDataForm2.responseLvName || '' }}</el-descriptions-item>
          <el-descriptions-item label="影响范围：">{{ eventDataForm2.effectRange || '' }}</el-descriptions-item>
          <el-descriptions-item label="影响时间：">{{ eventDataForm2.effectTime || '' }}</el-descriptions-item>
          <el-descriptions-item label="措施建议：" :span="2">{{ eventDataForm2.measure || '' }}</el-descriptions-item>
          <el-descriptions-item label="研判人：" :span="2">
            <el-row style="width: 100%;">
              <!-- <el-col :span="10" v-for="(item, i) in eventDataForm2.judgeUser_list" :key="i" style="padding-bottom: 4px">
                {{ item }}
              </el-col> -->
              {{ eventDataForm2.judgeUser || '' }}
            </el-row>
          </el-descriptions-item>
          <el-descriptions-item label="研判时间：" :span="2">{{ eventDataForm2.judgeTime || '' }}</el-descriptions-item>
        </el-descriptions>
        <el-descriptions slot="slot2"
          :labelStyle="{ display: 'inline-block', width: '120px', 'text-align': 'right', 'padding-right': '12px', 'margin-right': '0', 'box-sizing': 'border-box' }"
          :column="3" :colon="false" class="shenpi">
          <el-descriptions-item label="审批意见：" :span="3">{{ eventDataForm2.approvalOpinion || '' }}
          </el-descriptions-item>
          <el-descriptions-item label="审批人：">{{ eventDataForm2.approvalUser || '' }}</el-descriptions-item>
          <el-descriptions-item label="单位及部门：">{{ eventDataForm2.approvalDept || '' }}</el-descriptions-item>
          <el-descriptions-item label="审批时间：">{{ eventDataForm2.approvalTime || '' }}</el-descriptions-item>
        </el-descriptions>
      </LsdDialogTitle>
    </LsdDialog>
    <!-- 受损设备查看 -->
    <el-dialog title="受损设备查看" :visible.sync="shousunShow" width="50%">
      <el-table :data="shousunTable" :header-cell-style="{
        background: '#B1C8F9',
        color: '#000',
      }" style="width: 100%" border>
        <el-table-column prop="lineName" align="center" label="停运输电线路名称" width="180">
        </el-table-column>
        <el-table-column prop="voltageClasses" align="center" label="电压等级" width="100">
        </el-table-column>
        <el-table-column prop="unitName" align="center" label="所属单位">
        </el-table-column>
        <el-table-column prop="tripCause" align="center" label="停运/跳闸原因">
        </el-table-column>
        <el-table-column prop="blackoutTime" align="center" width="180" label="停电时间">
        </el-table-column>
      </el-table>
      <div style="height: 20px"></div>
      <div style="margin-top: 10px; float: right" class="InformationList-table-pag flexBetween">
        <div class="fontSize14">共{{ shousunTableTotal }}条数据，共{{ calcNum(shousunTableTotal) }}页</div>
        <el-pagination background layout="prev, pager, next" :total="shousunTableTotal"
          @current-change="changeShousunTablePageNum">
        </el-pagination>
      </div>
    </el-dialog>
  </div>
</template>

<script>
// 响应研判 api
import {
  listPage,
  deleteById,
  updById,
  saveAdd,
  getById,
  getEmergencyEventsOptionsApi,
  getJudgeStandardApi,
  getEmergencyEventsDataApi,
  // handleSubmitApi,
  // approveApi,
  getJudgeInfoListApi,
  getEditSubmitNoJudgeEventApi,
  getJudgeUser
} from "@/api/EmergencyDisposal/xyyp.js";
import { yanpan_table } from "./components/config";
import { getDictByGroupEmergency } from "@/api/common.js";
import { showTime } from "@/lib";
import { zqxx_columns } from "./components/config";
import { getInfoDetailList } from "@/api/EmergencyDisposal/zqbs.js";
import { getCityTree } from "@/api/EarlyWarningManagement/yjxxsj";
import { handleFlow } from "@/utils/flowMixin.js";

export default {
  name: "InformationList",
  components: {},
  data() {
    const getRatioTotal = ({ columns, data }) => {
      const sums = [];
      if (data) {
        columns.forEach((column, index) => {
          if (index === 0) {
            sums[index] = "合计";
            return;
          }
          const values = data.map(item => Number(item[column.property]));
          if (column.property != "tqRater" && column.property != "ptyhRater" && column.property != "zyyhRater") {
            sums[index] = values.reduce((prev, curr) => {
              const value = Number(curr);
              if (!isNaN(value)) {
                return prev + curr;
              } else {
                return prev;
              }
            }, 0);
            sums[index];
          } else {
            console.log("+++", column.property);
            sums[index] = (sums[index - 1] / sums[index - 2] * 100).toFixed(0) + "%";
          }
        });
        return sums;
      }
    };
    return {
      objArr: {},
      yanpan_table, // 研判标准table
      type: 0, // 0新增 1保存 2提交 3审批
      multipleSelection: [],
      // 筛选信息
      formData: [
        {
          elType: "input",
          id: "judgeName",
          label: "响应研判单",
          attrs: {
            value: "",
            size: "small",
            clearable: true,
            "collapse-tags": true
          }
        },
        {
          elType: "select",
          id: "eventCode",
          label: "事件类别",
          dic: "dic_xqlb",
          attrs: {
            value: "",
            size: "small",
            clearable: true,
            filterable: true,
            "collapse-tags": true
          },
          options: []
        },
        {
          elType: "select",
          id: "responseLvCode",
          label: "响应级别",
          dic: "dic_xyjb",
          attrs: {
            value: "",
            clearable: true,
            size: "small",
            filterable: true,
            "collapse-tags": true
          },
          options: []
        },
        {
          elType: "input",
          id: "effectRange",
          label: "影响范围",
          // dic: "dic_yxfw",
          attrs: {
            value: "",
            size: "small",
            clearable: true,
            // filterable: true,
            "collapse-tags": true
          }
          // options: []
        },
        {
          elType: "dateTimePicker",
          id: "judgeTime",
          label: "研判时间",
          attrs: {
            value: "",
            size: "small",
            clearable: true,
            type: "datetimerange",
            "start-placeholder": "开始日期",
            "end-placeholder": "结束日期",
            "value-format": "yyyy-MM-dd HH:mm:ss"
          }
        },
        {
          elType: "select",
          id: "isResponse",
          label: "是否启动响应",
          // dic: "dic_xxly",
          attrs: {
            value: "",
            size: "small",
            clearable: true,
            filterable: true,
            "collapse-tags": true
          },
          options: [
            {
              label: "否",
              value: "0"
            },
            {
              label: "是",
              value: "1"
            }
          ]
        },
        // {
        //   elType: "select",
        //   id: "responseId",
        //   label: "关联响应命令单",
        //   attrs: {
        //     value: "",
        //     size: "small",
        //     clearable: true,
        //     filterable: true,
        //     "collapse-tags": true
        //   },
        //   options: []
        // },
        {
          elType: "select",
          id: "judgeState",
          label: "状态",
          attrs: {
            value: "",
            size: "small",
            clearable: true,
            filterable: true,
            "collapse-tags": true
          },
          options: [
            {
              label: "编辑中",
              value: "0"
            },
            {
              label: "待审批",
              value: "1"
            },
            {
              label: "已审批",
              value: "2"
            }
          ]
        }
      ],
      // 表格信息
      table: {
        isSelectFlag: true, // 是否展示选择器
        compRef: "gjxm",
        isSequenceFlag: true, // 是否展示序号
        isShowPage: true, // 是否展示分页
        resetFlag: true,
        loading: false,
        title: "响应研判单列表",
        actions: [
          {
            id: "dialogVisible",
            text: "新增",
            type: "primary",
            btnAttr: { size: "small" }
          }
          // {
          //   id: "yjtzd",
          //   text: "响应命令单",
          //   type: "primary",
          //   btnAttr: { size: "small" }
          // }
        ],
        tableData: [],
        columns: [
          {
            prop: "judgeName",
            label: "响应研判单",
            align: "left",
            "min-width": "300px",
            render: (h, { row }) => {
              return (
                <div>
                  {
                    <span
                      class='commonTableStyle'
                      style='width: 100%;'
                      {...{
                        on: {
                          click: () => {
                            this.toXiangyingDetail(row);
                          }
                        }
                      }}
                    >
                      {row.judgeName}
                    </span>
                  }
                </div>
              );
            }
          },
          {
            prop: "eventName",
            label: "事件类别",
            align: "center"
          },
          {
            prop: "responseLvName",
            label: "响应级别",
            align: "center"
          },
          {
            prop: "effectRange",
            label: "影响范围",
            align: "left",
            "min-width": "100px"
          },
          {
            prop: "judgeTime",
            label: "研判时间",
            align: "center",
            "min-width": "180px"
            // render: (h, { row }) => {
            //   return (
            //     <div>
            //       {
            //         <span>
            //           {row.effectStartTime}至{row.effectEndTime}
            //         </span>
            //       }
            //     </div>
            //   )
            // }
          },
          {
            prop: "isResponse",
            label: "是否启动响应",
            align: "center",
            "min-width": "100px",
            render: (h, { row }) => {
              return (
                <div>
                  {
                    <span
                    >
                      {row.isResponse === "1" ? "是" : "否"}
                    </span>
                  }
                </div>
              );
            }
          },
          {
            prop: "responseName",
            label: "关联响应命令单",
            align: "left",
            "min-width": "250px",
            render: (h, { row }) => {
              return (
                <div>
                  {
                    <span
                      class='commonTableStyle'
                      style='width: 100%;'
                      {...{
                        on: {
                          click: () => {
                            this.toResponseDetail(row.responseId);
                          }
                        }
                      }}
                    >
                      {row.responseName}
                    </span>
                  }
                </div>
              );
            }
          },
          {
            prop: "judgeState",
            label: "状态",
            align: "center",
            "min-width": "100px",
            formatter: (row, column, cellValue, index) => {
              if (cellValue === "0") {
                return "编辑中";
              } else if (cellValue === "1") {
                return "待审批";
              } else if (cellValue === "2") {
                return row.isResponse === "1" ? "已审批" : "已完结";
              } else if (cellValue === "3") {
                return "驳回";
              }
            }
          },
          {
            prop: "cz",
            label: "操作",
            align: "center",
            fixed: "right",
            "min-width": "100px",
            render: (h, scope) => {
              let arr = [];
              const userId = JSON.parse(sessionStorage.getItem("account")).id;
              const tbPower = this.common.isHasPower("tbr");
              // const spPower = this.common.isHasPower("spr");
              if (["0", "3"].includes(scope.row.judgeState) && tbPower) {
                arr = ["编辑", "删除"];
              } else if (scope.row.judgeState === "1" && scope.row.nextAssignee && scope.row.nextAssignee.includes(userId) && scope.row.operate === true) {
                arr = ["审批"];
              } else if (scope.row.judgeState === "2" && scope.row.isResponse == "1" && scope.row.createState == "0" && tbPower) {
                arr = ["生成响应命令"];
              } else if (scope.row.judgeState === "2" && scope.row.isResponse == "1" && scope.row.createState == "1" && tbPower) {
                arr = ["已生成响应命令"];
              }
              return (
                <div>
                  {
                    arr.map(item => {
                      if (item === "已生成响应命令") {
                        return (
                          <span style='margin:0 10px'>
                            {item}
                          </span>
                        );
                      } else {
                        return (
                          <span style='color:#3561fd;cursor:pointer;margin:0 10px' {...{
                            on: {
                              click: () => {
                                this.actionHandle(item, scope);
                              }
                            }
                          }}>
                            {item}
                          </span>
                        );
                      }

                    })
                  }
                </div>
              );
            }
          }
        ],
        // 表格样式
        tableAttr: {
          // "max-height": "430px",
          // height: "430px",
          stripe: false,
          border: true,
          fit: true,
          "show-header": true,
          "highlight-current-row": true,
          "cell-style": {
            "font-size": "16px"
          },
          "header-cell-style": {
            "text-align": "center",
            "background-color": "#B1C8F9",
            border: "1px solid #ccc",
            "font-size": "16px"
          }
        }
      },
      // 灾情信息
      disasterInfoConfig: {
        isSelectFlag: false,
        compRef: "gjxm",
        isSequenceFlag: false,
        // isShowPage: true,
        resetFlag: true,
        loading: false,
        // title: "灾情信息报送单列表",
        actions: [
        ],
        tableData: [],
        columns: zqxx_columns,
        tableAttr: {
          // height: "300px",
          stripe: false,
          "show-summary": true,
          "summary-method": getRatioTotal,
          border: true,
          fit: true,
          "show-header": true,
          "highlight-current-row": true,
          "cell-style": {
            "font-size": "16px"
          },
          "header-cell-style": {
            "text-align": "center",
            "background-color": "#B1C8F9",
            border: "1px solid #ccc",
            "font-size": "16px"
          }
        }
      },
      // 分页信息
      paginationAtrrs: {
        total: 0,
        "background": true,
        layout: "prev, pager, next",
        "current-page": 1,
        "page-size": 10
        // "page-sizes": [10, 20, 30, 40, 50, 100]
      },
      activeNames: ["1", "2", "3", "4", "5", "6"], // 折叠面板默认展开列
      activeNames1: ["1", "2"], // 折叠面板默认展开列
      form: {
        judgeName: "", // 响应研判单名称
        eventCode: "", // 事件类别编号
        responseLvCode: "", // 响应级别
        effectRange: "", // 影响范围
        judgeTime: [], // 研判时间
        judgeStartTime: "",
        judgeEndTime: "",
        isResponse: "", // 是否启动响应
        judgeState: "" // 状态
      }, // 筛选from
      pageNum: 1,
      pageSize: 10,
      // 弹窗信息
      dialogConfig: {
        title: "响应研判单",
        isShow: false, // 弹窗显示隐藏
        btnList: []
      },
      // 生成响应命令单弹窗信息
      dialogConfig1: {
        title: "研判结果处理",
        isShow: false, // 弹窗显示隐藏
        btnList: [
          {
            name: "生成响应命令单",
            id: "createOrderBtn", // 事件名
            type: "primary",
            size: "small"
          },
          {
            name: "取消",
            id: "Qxiao2",
            size: "small"
          }
        ]
      },
      // 折叠面板信息
      titleConfig: [
        {
          title: "事件信息",
          name: "1",
          slot: "slot1"
        },
        {
          title: "灾情信息",
          name: "2",
          slot: "slot2"
        },
        {
          title: "研判标准",
          name: "3",
          slot: "slot3"
        },

        {
          title: "研判结果",
          name: "4",
          slot: "slot4"
        },
        {
          title: "填报信息",
          name: "5",
          slot: "slot5"
        }
      ],
      // 折叠面板信息
      titleConfig1: [
        {
          title: "研判结果",
          name: "1",
          slot: "slot1"
        },
        {
          title: "审批信息",
          name: "2",
          slot: "slot2"
        }
      ],
      // 弹窗表单信息
      // 事件弹窗表单
      evenFormConfig: {
        formData: [
          {
            type: "select",
            label: "应急事件",
            prop: "emergencyEventIds",
            // dic: "dic_xxly",
            class: "sjgy",
            lableWidth: "130px",
            multiple: true,
            option: [],
            name: "emergencyEvent",
            isDisabled: false
          }
        ],
        rules: {
          emergencyEventIds: [
            { required: true, message: "请选择应急事件", trigger: "change" }
          ]
        }
      },
      // 应急事件form
      eventDataForm: {},
      eventDataForm2: {},
      // 弹窗表单信息  - 研判结果
      yanpanFormConfig: {
        formData: [
          {
            type: "input",
            label: "响应研判单",
            prop: "judgeName",
            class: "half",
            lableWidth: "140px",
            isDisabled: false
          },
          {
            type: "select",
            label: "是否启动响应",
            prop: "isResponse",
            class: "half",
            lableWidth: "140px",
            option: [
              { label: "是", value: "1" },
              { label: "否", value: "0" }
            ],
            name: "isResponseName",
            isDisabled: false
          },
          {
            type: "input",
            label: "事件类别",
            prop: "eventName",
            class: "half",
            lableWidth: "140px",
            isDisabled: true
          },
          {
            type: "select",
            label: "响应级别",
            prop: "responseLvCode",
            name: "responseLvName",
            dic: "dic_xyjb",
            class: "half",
            lableWidth: "140px",
            option: [],
            isDisabled: false
          },
          // {
          //   type: "input",
          //   label: "影响范围",
          //   prop: "effectRange",
          //   class: "half",
          //   lableWidth: "140px",
          //   isDisabled: false
          // },
          {
            type: "selectTree",
            label: "影响范围",
            prop: "effectRange",
            name: "geo",
            keyWord: "keyWord",
            treeRef: "treeRef",
            title: "影响范围选择",
            choose: false,
            ref: "tree_select1",
            class: "half",
            multiple: true,
            lableWidth: "140px",
            option: [],
            treeData: {
              data: [],
              checked: [],
              props: {
                children: "children",
                label: "extName",
                value: "geo"
              }
            }
          },
          {
            type: "input",
            label: "影响时间",
            prop: "effectTime",
            class: "half",
            // dateType: "datetimerange",
            lableWidth: "140px",
            isDisabled: true
          },
          {
            type: "textarea",
            label: "措施建议",
            prop: "measure",
            class: "sjgy",
            lableWidth: "140px",
            isDisabled: false
          },
          {
            type: "select",
            label: "研判人",
            prop: "judgeUserIds",
            // dic: "dic_ypr",
            class: "sjgy",
            lableWidth: "140px",
            option: [],
            multiple: true,
            name: "judgeUser",
            isDisabled: false,
            filterable: true
          },
          {
            type: "dataPicker",
            label: "研判时间",
            prop: "judgeTime",
            class: "half",
            dateType: "datetime",
            lableWidth: "140px",
            isDisabled: false,
            limit: 99
          }
        ],
        rules: {
          judgeName: [
            {
              required: true,
              message: "请输入响应研判单名称",
              trigger: "blur"
            }
          ],
          isResponse: [
            { required: true, message: "请选择是否启动响应", trigger: "change" }
          ],
          responseLvCode: [
            { required: true, message: "请选择响应级别", trigger: "change" }
          ],
          effectRange: [
            { required: true, message: "请输入影响范围", trigger: "blur" }
          ],
          measure: [
            { required: true, message: "请输入措施建议", trigger: "blur" }
          ],
          effectStartTime: [
            { required: true, message: "请选择影响时间", trigger: "change" }
          ],
          judgeUserIds: [
            { required: true, message: "请选择研判人", trigger: "change" }
          ],
          judgeTime: [
            { required: true, message: "请选择研判时间", trigger: "change" }
          ]
        }
      },
      // 填报人表单
      createFormConfig: {
        formData: [
          {
            type: "input",
            label: "填报人",
            prop: "creator",
            // class: "third",
            lableWidth: "140px",
            isDisabled: true
          },
          {
            type: "input",
            label: "单位及部门",
            // class: "third",
            prop: "createDeptName",
            lableWidth: "100px",
            isDisabled: true
          },
          {
            type: "input",
            label: "填报时间",
            class: "third",
            prop: "createTime",
            lableWidth: "140px",
            isDisabled: true
          }
        ]
      },
      // 审批人表单
      approverFormConfig: {
        formData: [
          {
            type: "input",
            label: "审批意见",
            prop: "approvalOpinion",
            class: "sjgy",
            lableWidth: "140px"
          },
          {
            type: "input",
            label: "审批人",
            isDisabled: true,
            prop: "approvalUser",
            // class: "third",
            lableWidth: "140px"
          },
          {
            type: "input",
            label: "单位及部门",
            isDisabled: true,
            // class: "third",
            prop: "approvalDept",
            lableWidth: "100px"
          },
          {
            type: "input",
            label: "审批时间",
            isDisabled: true,
            class: "third",
            prop: "approvalTime",
            lableWidth: "140px"
          }
        ]
      },
      approveSign: 1, // 1 pass 2 reject
      emergencyEvent: "",
      judgeUser: "",
      status: "",
      selected_events: [], // 已选事件
      shousunShow: false,
      shousunTable: [],
      shousunTablePageNum: 1,
      shousunTableTotal: 0,
      shousun_params: {}
    };
  },
  watch: {
    "$route.query.status": {
      handler(newVal) {
        console.log(newVal);
        this.status = newVal || "";
        // this.form.judgeState = newVal || "";
        this.list();
      },
      deep: true
    }
    // "dialogConfig.isShow": {
    //   handler(val) {
    //     if (val) {
    //       this.$nextTick(() => {
    //         // console.log(this.$refs.yanpan_dialog.getElementsByClassName("el-dialog__body"));
    //         const dom = document.getElementsByClassName("el-dialog__body");
    //         console.log(dom);
    //         document.getElementsByClassName("el-dialog__body")[0].addEventListener("scroll", (e) => {
    //           console.log(e, document.getElementsByClassName("el-dialog__body")[0].scrollTop);
    //         }, true);
    //       });
    //     }
    //     console.log(val);
    //     // yanpan_dialog
    //   }
    // }
  },
  computed: {
    getCreator() {
      const account = sessionStorage.getItem("account");
      const org = sessionStorage.getItem("org");
      const role = sessionStorage.getItem("role");
      const creator = {
        name: (account && JSON.parse(account).realName) || "",
        dept: (org && JSON.parse(org).orgName) || "",
        role: (role && JSON.parse(role)) || "",
        org: (org && JSON.parse(org)) || "",
        unitName: (org && JSON.parse(org).unitName) || ""
      };
      return creator;
    }
  },
  mounted() {
    this.$nextTick(async () => {
      await this.getInputVal();
      const { type, id, status } = this.$route.query;
      if (type == 1 && id) {
        // console.log(type);
        const ids = id.split(",");
        this.dialogVisible();
        await this.getEmergencyEventsData(ids);
        // 获取应急事件下拉数据
        await this.getEmergencyEventsOptions();
        this.emergencyEvent = this.getEventNames(ids);
        this.disabledNotSameTypeEvent(ids[0]);
      }
      // console.log(status);
      this.status = status || "";
      // this.form.judgeState = status || "";
      this.list();
      this.getUnitTree();
      this.getJudgeUser();
    });
  },
  // mounted() {

  // },
  methods: {
    // 列表表格按钮事件
    actionHandle(item, scope) {
      if (item === "编辑") {
        this.HanEdit(scope.row);
      } else if (item === "删除") {
        this.handledelResponse(scope.row.id);
      } else if (item === "生成响应命令") {
        this.createOrder(scope.row);
      } else if (item === "审批") {
        this.handledelApprove(scope.row);
      }
    },
    // 影响范围
    handleNodeClick(data, node, item) {
      if (item.label === "影响范围") {
        const result = this.$refs.yanpanFormComponent.form.effectRange;
        // if (node.parent.data instanceof Array) {
        if (data.children.length > 0) {
          if (result.includes(data.extName)) return;
          else {
            this.$refs.yanpanFormComponent.form.effectRange.push(data.extName);
            this.$refs.yanpanFormComponent.form.geo.push(data.geo);
            // const obj = { effectRange: data.extName, locationId: data.id, geo: data.geo };
            // this.rangeInfo.push(obj);
          }
        } else {
          if (result.includes(`${node.parent.data.extName}${data.extName}`)) return;
          else {
            this.$refs.yanpanFormComponent.form.effectRange.push(`${node.parent.data.extName}${data.extName}`);
            this.$refs.yanpanFormComponent.form.geo.push(data.geo);
            // const obj = { effectRange: `${node.parent.data.extName}${data.extName}`, locationId: data.id, geo: data.geo };
            // this.rangeInfo.push(obj);
          }
        }
      }
    },
    // 影响范围树状接口
    getUnitTree() {
      getCityTree().then(res => {
        this.yanpanFormConfig.formData[4].treeData.data = res;
      });
    },
    // 获取研判人
    async getJudgeUser() {
      const member = await getJudgeUser();
      console.log("member", member);
      this.yanpanFormConfig.formData[7].option = member.map(item => {
        return {
          label: `${item.realName}${item.phone || ""}`,
          value: item.id,
          ...item
        };
      });
    },
    // 获取应急事件来源
    getEmergencyEventsOptions() {
      return new Promise(resolve => {
        getEmergencyEventsOptionsApi().then(res => {
          this.evenFormConfig.formData[0].option = res.map(item => {
            return {
              label: item.emergencyEvent,
              value: item.id,
              ...item,
              disabled: false
            };
          });
          resolve();
        });
      });
    },
    // 选择应急事件
    eventChangeSelected(val, item) {
      const filter = this.evenFormConfig.formData[0].option.filter(item => item.id == val);
      this.emergencyEvent = this.getEventNames(val);
      this.getEmergencyEventsData(val);
      this.disabledNotSameTypeEvent(val.length ? val[0] : "");
      this.$set(this.$refs.yanpanFormComponent.form, "judgeName", `${filter[0].emergencyEvent}响应研判单`);
    },
    // 获取应急事件名
    getEventNames(val) {
      const filter = this.evenFormConfig.formData[0].option.filter(item => val.includes(item.id));
      // console.log(filter);
      this.selected_events = filter.map(item => {
        return {
          label: item.emergencyEvent,
          value: item.id
        };
      });
      // console.log(this.selected_events);
      const emergencyEvents = filter.map(item => {
        return item.emergencyEvent;
      }).join("、");
      return emergencyEvents;
    },
    // 禁用非同类型事件
    disabledNotSameTypeEvent(id) {
      const { option } = this.evenFormConfig.formData[0];
      if (id) {
        const filter = option.filter(item => item.id == id);
        if (filter.length) {
          this.evenFormConfig.formData[0].option = option.map(item => {
            item.disabled = item.eventCode != filter[0].eventCode;
            return item;
          });
        }
      } else {
        this.evenFormConfig.formData[0].option = option.map(item => {
          item.disabled = false;
          return item;
        });
      }
    },
    getYanpanrenNames(val) {
      // console.log(this.yanpanFormConfig.formData);
      return this.yanpanFormConfig.formData[7].option.filter(item => val.includes(item.value)).map(item => {
        return item.label;
      }).join("、");
    },
    // 获取应急事件详细数据
    async getEmergencyEventsData(val, responseLvName, responseLvCode) {
      try {
        if (val.length) {
          const res = await getEmergencyEventsDataApi({ ids: val.join(",") });
          // console.log(res);
          this.eventDataForm = Object.assign({}, this.eventDataForm, res);
          const { id, eventCode, eventName, effectRange, occurrenceTime, geo, emergencyEvent, eventLvName } = res;
          this.$set(this.$refs.yanpanFormComponent.form, "eventName", eventName);
          if (this.$refs.yanpanFormComponent.form.effectRange.length === 0) {
            this.$set(this.$refs.yanpanFormComponent.form, "effectRange", effectRange.split("、"));
            this.$set(this.$refs.yanpanFormComponent.form, "geo", geo.split("、"));
          }
          this.$set(this.$refs.yanpanFormComponent.form, "effectTime", `${occurrenceTime} 至响应终止`);
          this.$set(this.$refs.yanpanFormComponent.form, "judgeName", `${emergencyEvent}响应研判单`);
          if (this.type == 1) {
            const respCode = eventLvName.split("/")[1];
            this.objArr[respCode];
            this.$set(this.$refs.yanpanFormComponent.form, "responseLvName", respCode);
            this.$set(this.$refs.yanpanFormComponent.form, "responseLvCode", this.objArr[respCode]);
          } else {
            this.$set(this.$refs.yanpanFormComponent.form, "responseLvName", responseLvName);
            this.$set(this.$refs.yanpanFormComponent.form, "responseLvCode", responseLvCode);
          }

          // 获取研判标准
          this.getJudgeStandard(eventCode);
          // 根据事件获取灾情信息
          this.getJudgeInfoList(id);
        } else {
          this.$set(this.$refs.yanpanFormComponent.form, "eventName", "");
          this.$set(this.$refs.yanpanFormComponent.form, "effectRange", "");
          this.$set(this.$refs.yanpanFormComponent.form, "effectTime", "");
        }
      } catch (error) {
        console.error(error);
      }

    },
    // 获取研判标准
    async getJudgeStandard(eventCode) {
      try {
        const res = await getJudgeStandardApi({ eventCode });
        this.yanpan_table.tableData = res;
        // 合并
        this.yanpan_table.tableAttr["span-method"] = this.studyJudgeRowMerge;
      } catch (error) {
        console.log(error);
      }
    },
    // 研判标准合并行
    studyJudgeRowMerge({ row, column, rowIndex, columnIndex }) {
      if (columnIndex === 0) {
        const _row = this.rowMerge(this.yanpan_table.tableData, "eventName")[rowIndex];
        const _col = _row > 0 ? 1 : 0;

        return {
          rowspan: _row,
          colspan: _col
        };
      } else if (columnIndex === 1) {
        const _row = this.rowMerge(this.yanpan_table.tableData, "responseLvName")[rowIndex];
        const _col = _row > 0 ? 1 : 0;

        return {
          rowspan: _row,
          colspan: _col
        };
      }
    },
    // 合并操作
    rowMerge(data, field) {
      const spanArr = [];
      let pos = 0;
      for (let i = 0; i < data.length; i++) {
        if (i == 0) {
          spanArr.push(1);
          pos = 0;
        } else if (data[i][field] === data[i - 1][field]) {
          spanArr[pos] += 1;
          spanArr.push(0);
        } else {
          spanArr.push(1);
          pos = i;
        }
      }
      return spanArr;
    },
    yjtzd() {
      this.dialogConfig1.isShow = true;
    },
    // 弹窗按钮点击事件 对应id绑定事件
    handleBtn(item) {
      this[item.id]();
    },
    handleBtn1(item) {
      this[item.id]();
    },
    // 重置
    reset() {
      this.form = this.$options.data().form;
      // this.form.judgeState = this.status;
      this.list();
    },
    // 检索
    async query() {
      this.list();
    },
    // 保存
    async submitForm() {
      this.$refs.evenFormComponent.isValidate();
      this.$refs.yanpanFormComponent.isValidate();

      const { emergencyEventIds } = this.$refs.evenFormComponent.form;
      const { judgeUserIds } = this.$refs.yanpanFormComponent.form;

      const flag = this.$refs.evenFormComponent.flag;
      const flag1 = this.$refs.yanpanFormComponent.flag;
      if (flag && flag1) {
        let approverForm = {};
        if (this.$refs.approverFormComponent && this.$refs.approverFormComponent.form) {
          approverForm = this.$refs.approverFormComponent.form;
        }

        const params = Object.assign({}, this.$refs.evenFormComponent.form, this.$refs.yanpanFormComponent.form, this.$refs.createFormComponent.form, approverForm);

        params.emergencyId = this.eventDataForm.id;
        params.eventCode = this.eventDataForm.eventCode;
        params.emergencyEventIds = emergencyEventIds.join(",");
        params.judgeUserIds = judgeUserIds.join(",");
        params.emergencyEvent = this.emergencyEvent;
        params.judgeUser = this.judgeUser;
        if ([0, 1, 2].includes(this.type)) {
          params.effectRange = this.$refs.yanpanFormComponent.form.effectRange.join("、");
          params.geo = this.$refs.yanpanFormComponent.form.geo.join("、");
        }
        // console.log(params);
        try {
          if (this.type === 1) {
            await saveAdd(params);
            this.$message({
              message: "保存成功",
              type: "success"
            });
            this.list();
            this.Qxiao();
          } else if (this.type === 0) {
            await updById(params);
            this.$message({
              message: "修改成功",
              type: "success"
            });
            this.list();
            this.Qxiao();
          } else if (this.type === 2) {
            const flowData = {
              bizKey: "",
              flowKey: "emergency_judge_001",
              taskId: "task1",
              callbackUrl: "/emergency/emergencyJudge/handleFlow",
              idea: "1",
              isNext: true,
              flowType: "新增",
              ideaMsg: ""
            };
            if (this.id) {
              flowData.bizKey = this.id;
            } else {
              const res = await saveAdd(params);
              flowData.bizKey = res;
            }
            // await handleSubmitApi(params);
            const callBack = () => {
              this.$message({
                message: "提交成功",
                type: "success"
              });
              this.list();
              this.Qxiao();
            };
            handleFlow(flowData, params, callBack);
          } else if (this.type === 3) {
            const flowData = {
              bizKey: this.id,
              flowKey: "emergency_judge_001",
              taskId: "task2",
              callbackUrl: "/emergency/emergencyJudge/handleFlow",
              idea: "",
              isNext: false,
              flowType: "审核",
              ideaMsg: ""
            };
            params.approveSign = this.approveSign == 1 ? "pass" : "reject";
            params.effectRange = this.$refs.yanpanFormComponent.form.effectRange;
            params.geo = this.$refs.yanpanFormComponent.form.geo;
            params.approvalDeptId = this.getCreator.org.orgCode;
            params.approvalOpinion = this.approveSign == 1 && !approverForm.approvalOpinion ? "同意" : approverForm.approvalOpinion;
            if (this.approveSign == 1) {
              flowData.idea = "1";
              flowData.ideaMsg = "同意";
              flowData.isNext = false;
            } else {
              flowData.idea = "0";
              flowData.ideaMsg = "驳回";
              flowData.isNext = false;
            }
            const callBack = () => {
              this.$message({
                message: "审核成功",
                type: "success"
              });
              this.list();
              this.Qxiao();
            };
            handleFlow(flowData, params, callBack);
            // await approveApi(params);
            // message = "审核成功";
          }

          // this.dialogConfig.isShow = false

        } catch (error) {
          console.error(error);
        }
      }
    },
    // 直接提交
    async BSubmit() {
      this.type = 2;
      this.submitForm();
    },
    // 取消
    Qxiao() {
      this.evenFormConfig.formData[0].isDisabled = false;
      this.yanpanFormConfig.formData[0].isDisabled = false;
      this.yanpanFormConfig.formData[1].isDisabled = false;
      this.yanpanFormConfig.formData[3].isDisabled = false;
      this.yanpanFormConfig.formData[4].isDisabled = false;
      this.yanpanFormConfig.formData[6].isDisabled = false;
      this.yanpanFormConfig.formData[7].isDisabled = false;
      this.yanpanFormConfig.formData[8].isDisabled = false;
      this.selected_events = [];
      this.$refs.evenFormComponent.form.emergencyEventIds = [];
      this.disasterInfoConfig.tableData = [];
      this.emergencyEvent = "";
      this.judgeUser = "";
      this.yanpan_table.tableData = [];
      // console.log(this.$refs.yanpanFormComponent)
      this.$refs.yanpanFormComponent.form = this.$refs.yanpanFormComponent.$options.data().form;
      this.$refs.createFormComponent.form = this.$refs.createFormComponent.$options.data().form;
      if (this.$refs.approverFormComponent) {
        this.$refs.approverFormComponent.form = this.$refs.approverFormComponent.$options.data().form;
      }
      this.$nextTick(() => {
        this.$refs.evenFormComponent.$refs.formInlines.clearValidate();
        this.$refs.yanpanFormComponent.$refs.formInlines.clearValidate();
        // this.$refs.createFormComponent.$refs.formInlines.clearValidate()
        this.eventDataForm = {};
        this.dialogConfig.isShow = false;
        this.dialogConfig1.isShow = false;
        if (this.titleConfig.length == 6) {
          this.titleConfig.pop();
        }
        if (this.$route.query.type == 1) {
          const query = JSON.parse(JSON.stringify(this.$route.query));
          query.type = 2;
          this.$router.replace({ path: "/EmergencyList", query: { eventState: 1 } });

        }
      });

    },
    // 弹窗关闭图标
    close() {
      this.Qxiao();
    },
    // 获取下拉框数据
    getInputVal() {
      // 研判结果的下拉选项
      this.yanpanFormConfig.formData.forEach((item) => {
        if (item.dic) {
          this.objArr = {};
          getDictByGroupEmergency({ groupCode: item.dic }).then(res => {
            const option = res.map((item) => {
              this.objArr[item.dicName] = Number(item.dicCode);
              return {
                label: item.dicName,
                value: Number(item.dicCode)
              };
            });
            item.option = option;
            // console.log(111, this.objArr);
          });
        }
      });
      this.formData.forEach((item) => {
        if (item.dic) {
          getDictByGroupEmergency({ groupCode: item.dic }).then(res => {
            const option = res.map((item) => {
              return {
                label: item.dicName,
                value: Number(item.dicCode)
              };
            });
            item.options = option;
          });
        }
      });
      this.evenFormConfig.formData.forEach((item) => {
        if (item.dic) {
          getDictByGroupEmergency({ groupCode: item.dic }).then(res => {
            const option = res.map((item) => {
              return {
                label: item.dicName,
                value: Number(item.dicCode)
              };
            });
            item.option = option;
          });
        }
      });
    },
    // 列表
    async list() {
      const params = {
        pageNum: this.pageNum,
        pageSize: this.pageSize,
        ...this.form
      };
      params.judgeStartTime = this.form.judgeTime.length ? this.form.judgeTime[0] : "";
      params.judgeEndTime = this.form.judgeTime.length ? this.form.judgeTime[1] : "";
      params.judgeState = this.form.judgeState || this.status;
      const res = await listPage(params);
      this.table.tableData = res.data;
      this.paginationAtrrs.total = res.total;
    },
    // 抛出列表按钮
    onActionClick(item, index) {
      this[item.id](); // 调用按钮对应方法

      // 获取应急事件下拉数据
      this.getEmergencyEventsOptions();
    },
    // 新增
    dialogVisible() {
      this.type = 1;
      this.dialogConfig.btnList = [
        {
          name: "提交",
          id: "BSubmit", // 事件名
          type: "primary",
          size: "small"
        },
        {
          name: "保存",
          id: "submitForm",
          size: "small"
        },
        {
          name: "取消",
          id: "Qxiao",
          size: "small"
        }];
      this.dialogConfig.isShow = true;
      this.$nextTick(() => {
        setTimeout(() => {
          const { id, type } = this.$route.query;
          if (type == 1 && id) {
            this.$set(this.$refs.evenFormComponent.form, "emergencyEventIds", id.split(","));
          }
          // console.log(this.$refs)
          this.$set(this.$refs.yanpanFormComponent.form, "effectRange", []);
          this.$set(this.$refs.yanpanFormComponent.form, "geo", []);
          this.$refs.evenFormComponent.$refs.formInlines.clearValidate();
          this.$refs.yanpanFormComponent.$refs.formInlines.clearValidate();

          this.$set(this.$refs.createFormComponent.form, "creator", this.getCreator.name);
          this.$set(this.$refs.createFormComponent.form, "createDeptName", sessionStorage.getItem("dwbmName"));
          // this.$set(this.$refs.createFormComponent.form, "createTime", new Date().toLocaleString().replace(/\//g, "-"))
          this.$set(this.$refs.createFormComponent.form, "createTime", showTime(new Date()));

        }, 0);
      });
    },
    // 跳转响应命令单详情
    toResponseDetail(id) {
      this.$router.push({
        name: "EmergencyResponseinfo",
        query: {
          id
        }
      });
    },
    // 跳转响应研判详情
    toXiangyingDetail(id) {
      this.$router.push({
        name: "YpDetail",
        query: { id: id.id }
      });
    },
    // 选择器
    handleSelectionChange(val) {
      this.multipleSelection = val;
    },
    // 编辑
    HanEdit(id) {
      this.getData(id, 0);
      this.dialogConfig.btnList = [
        {
          name: "提交",
          id: "BSubmit", // 事件名
          type: "primary",
          size: "small"
        },
        {
          name: "保存",
          id: "submitForm",
          size: "small"
        },
        {
          name: "取消",
          id: "Qxiao",
          size: "small"
        }];
    },
    // 审批操作
    handledelApprove(id) {
      this.evenFormConfig.formData[0].isDisabled = true;
      this.yanpanFormConfig.formData[0].isDisabled = true;
      this.yanpanFormConfig.formData[4].type = "input";
      this.yanpanFormConfig.formData[4].isDisabled = true;
      this.yanpanFormConfig.formData[1].isDisabled = true;
      this.yanpanFormConfig.formData[3].isDisabled = true;
      this.yanpanFormConfig.formData[4].isDisabled = true;
      this.yanpanFormConfig.formData[6].isDisabled = true;
      this.yanpanFormConfig.formData[7].isDisabled = true;
      this.yanpanFormConfig.formData[8].isDisabled = true;
      this.titleConfig.push({
        title: "审批信息",
        name: "6",
        slot: "slot6"
      });

      this.getData(id, 3);
      this.dialogConfig.btnList = [
        {
          name: "同意",
          id: "agreeBtn",
          size: "small",
          type: "primary"
        },
        {
          name: "驳回",
          id: "bohuiBtn",
          size: "small"
        },
        {
          name: "取消",
          id: "Qxiao",
          size: "small"
        }];
    },
    // 获取响应单详情
    getData(id, type) {
      this.dialogConfig.isShow = true;
      this.type = type;
      console.log("type", type);
      getById({ id: id.id }).then(res => {
        this.id = res.id;
        const { emergencyEventIds, responseLvCode, judgeUserIds, emergencyEvent, effectRange, geo, isResponse, responseLvName } = res;
        res.emergencyEventIds = emergencyEventIds ? emergencyEventIds.split(",") : [];
        if (type == 0) {
          // 获取应急事件下拉数据
          this.getEditSubmitNoJudgeEvent(emergencyEventIds);
        }

        this.emergencyEvent = emergencyEvent;

        if (judgeUserIds) {
          res.judgeUserIds = judgeUserIds.split(",").map(item => item);
          this.judgeUser = this.getYanpanrenNames(res.judgeUserIds);
        }
        this.getEmergencyEventsData(res.emergencyEventIds, responseLvName, responseLvCode * 1);
        this.$nextTick(() => {
          this.$set(this.$refs.yanpanFormComponent.form, "effectRange", effectRange.split("、"));
          this.$set(this.$refs.yanpanFormComponent.form, "geo", geo.split("、"));
        });
        this.$refs.evenFormComponent.form.emergencyEventIds = res.emergencyEventIds;
        this.$set(this.$refs.evenFormComponent.form, "emergencyEvent", emergencyEvent);

        for (const j in res) {
          this.$set(this.$refs.yanpanFormComponent.form, j, res[j]);
        }
        this.$set(this.$refs.yanpanFormComponent.form, "isResponseName", isResponse == 1 ? "是" : "否");
        this.$set(this.$refs.createFormComponent.form, "creator", res.creator);
        this.$set(this.$refs.createFormComponent.form, "createDeptName", res.createDeptName);
        this.$set(this.$refs.createFormComponent.form, "createTime", res.createTime);
        if (this.$refs.approverFormComponent && type == 3) {
          this.$nextTick(() => {
            this.$set(this.$refs.yanpanFormComponent.form, "effectRange", effectRange);
            this.$set(this.$refs.yanpanFormComponent.form, "geo", geo);
          });
          if (res.approvalUser) {
            this.$set(this.$refs.approverFormComponent.form, "approvalUser", res.approvalUser);
            this.$set(this.$refs.approverFormComponent.form, "approvalDept", res.approvalDept);
            this.$set(this.$refs.approverFormComponent.form, "approvalTime", res.approvalTime);
          } else {
            // const { roleCode } = this.getCreator.role;
            // if (roleCode == "hb_spr") {
            this.$set(this.$refs.approverFormComponent.form, "approvalUser", this.getCreator.name);
            this.$set(this.$refs.approverFormComponent.form, "approvalDept", sessionStorage.getItem("dwbmName"));
            // this.$set(this.$refs.approverFormComponent.form, "approvalTime", new Date().toLocaleString().replace(/\//g, "-"))
            this.$set(this.$refs.approverFormComponent.form, "approvalTime", showTime(new Date()));
            // }
          }

        }

      });
    },
    // 审批
    agreeBtn() {
      this.approveSign = 1;
      this.submitForm();
    },
    // 驳回
    bohuiBtn() {
      this.approveSign = 2;
      this.submitForm();
    },
    // 删除响应研判单
    async handledelResponse(id) {
      this.$confirm("此操作将永久删除该条数据, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(() => {
        deleteById({
          id
        }).then(data => {
          if (data) {
            this.$message({
              message: "删除成功",
              type: "success"
            });
            this.list();
          }
        });
      }).catch(() => {
        this.$message({
          type: "info",
          message: "已取消删除"
        });
      });
    },
    // 分页
    handleSizeChange(val) {
      this.pageNum = val["current-page"];
      this.pageSize = val["page-size"];
      this.list();
    },
    // 生成响应命令
    createOrder(row) {
      this.dialogConfig1.isShow = true;
      getById({ id: row.id }).then(res => {
        const { judgeUser } = res;

        this.eventDataForm2 = res;
        this.eventDataForm2.judgeUser_list = judgeUser ? judgeUser.split("、") : [];
      });
    },
    Qxiao2() {
      this.dialogConfig1.isShow = false;
    },
    // 生成响应命令单
    createOrderBtn() {
      console.log(this.eventDataForm2);
      this.$router.push({
        name: "EmergencyResponselist",
        query: {
          judge_id: this.eventDataForm2.id, // 研判单id
          isAdd: 1
        }
      });
    },
    // 研判人选择
    yanpanrenChangeSelected(val, item) {
      // console.log(val, item);
      if (item.prop == "judgeUserIds") {
        this.judgeUser = this.getYanpanrenNames(val);
      }
    },
    // 根据应急事件获取灾情信息
    getJudgeInfoList(emergencyId) {
      getJudgeInfoListApi({ emergencyId }).then(res => {
        console.log(res);
        // 输电线路
        // 500
        const sdxl500KvTrip = res.some(item => item.sdxl500KvTrip);
        const sdxl500KvRecover = res.some(item => item.sdxl500KvRecover);
        // 220
        const sdxl220KvTrip = res.some(item => item.sdxl220KvTrip);
        const sdxl220KvRecover = res.some(item => item.sdxl220KvRecover);
        //  110kv
        const sdxl110KvTrip = res.some(item => item.sdxl110KvTrip);
        const sdxl110KvRecover = res.some(item => item.sdxl110KvRecover);
        //  35kv
        const sdxl35KvTrip = res.some(item => item.sdxl35KvTrip);
        const sdxl35KvRecover = res.some(item => item.sdxl35KvRecover);
        // console.log(sdxl110KvTrip, sdxl110KvRecover, sdxl35KvTrip, sdxl35KvRecover)
        // 变电站
        // 500
        const bdz500KvTrip = res.some(item => item.bdz500KvTrip);
        const bdz500KvRecover = res.some(item => item.bdz500KvRecover);
        // 220
        const bdz220KvTrip = res.some(item => item.bdz220KvTrip);
        const bdz220KvRecover = res.some(item => item.bdz220KvRecover);
        // 110kv
        const bdz110KvTrip = res.some(item => item.bdz110KvTrip);
        const bdz110KvRecover = res.some(item => item.bdz110KvRecover);
        // 35kv
        const bdz35KvTrip = res.some(item => item.bdz35KvTrip);
        const bdz35KvRecover = res.some(item => item.bdz35KvRecover);
        // console.log(bdz110KvTrip, bdz110KvRecover, bdz35KvTrip, bdz35KvRecover)
        // 配电线路
        // 10kv
        const pdxl10KvTrip = res.some(item => item.pdxl10KvTrip);
        const pdxl10KvRecover = res.some(item => item.pdxl10KvRecover);
        // console.log(pdxl10KvTrip, pdxl10KvRecover)
        // 台区
        const tqTrip = res.some(item => item.tqTrip);
        const tqRecover = res.some(item => item.tqRecover);
        const tqRater = res.some(item => item.tqRater);
        // console.log(tqTrip, tqRecover, tqRater)
        // 用户
        const ptyhTrip = res.some(item => item.ptyhTrip);
        const ptyhRecover = res.some(item => item.ptyhRecover);
        const ptyhRater = res.some(item => item.ptyhRater);
        // console.log(ptyhTrip, ptyhRecover, ptyhRater)
        // 重要用户
        const zyyhTrip = res.some(item => item.zyyhTrip);
        const zyyhRecover = res.some(item => item.zyyhRecover);
        const zyyhRater = res.some(item => item.zyyhRater);
        // console.log(zyyhTrip, zyyhRecover, zyyhRater)
        const columns = [
          {
            prop: "unitName",
            label: "所属单位",
            align: "center",
            "min-width": "90px"
          }];

        // 输电线路
        if (sdxl500KvTrip || sdxl500KvRecover || sdxl220KvTrip || sdxl220KvRecover || sdxl110KvTrip || sdxl110KvRecover || sdxl35KvTrip || sdxl35KvRecover) {
          columns.push({
            // prop: "",
            label: "输电线路",
            align: "center",
            "min-width": "80px",
            children: []
          });

          // 500
          if (sdxl500KvTrip || sdxl500KvRecover) {
            const children = [];
            // if (sdxl500KvTrip) {
            children.push({
              prop: "sdxl500KvTrip",
              label: "累计跳闸",
              align: "center",
              "min-width": "90px",
              render: (h, { row }) => {
                return (
                  <div>
                    {
                      <span
                        style='color:#3561fd;cursor:pointer;text-decoration: underline;'
                        {...{
                          on: {
                            click: () => {
                              this.showShousunDialog("sdxl", "500kV", row.emergencyId, row.unitId);
                            }
                          }
                        }}
                      >
                        {row.sdxl500KvTrip}
                      </span>
                    }
                  </div>
                );
              }
            });
            // }
            // if (sdxl500KvRecover) {
            children.push({
              prop: "sdxl500KvRecover",
              label: "累计恢复",
              align: "center",
              "min-width": "90px"
            });
            // }

            columns[1].children.push(
              {
                label: "500kV及以上",
                align: "center",
                "min-width": "80px",
                children
              });
          }

          // 220
          if (sdxl220KvTrip || sdxl220KvRecover) {
            const children = [];
            // if (sdxl220KvTrip) {
            children.push({
              prop: "sdxl220KvTrip",
              label: "累计跳闸",
              align: "center",
              "min-width": "90px",
              render: (h, { row }) => {
                return (
                  <div>
                    {
                      <span
                        style='color:#3561fd;cursor:pointer;text-decoration: underline;'
                        {...{
                          on: {
                            click: () => {
                              this.showShousunDialog("sdxl", "220kV", row.emergencyId, row.unitId);
                            }
                          }
                        }}
                      >
                        {row.sdxl220KvTrip}
                      </span>
                    }
                  </div>
                );
              }
            });
            // }
            // if (sdxl220KvRecover) {
            children.push({
              prop: "sdxl220KvRecover",
              label: "累计恢复",
              align: "center",
              "min-width": "90px"
            });
            // }

            columns[1].children.push(
              {
                label: "220kV",
                align: "center",
                "min-width": "80px",
                children
              });
          }

          // 110
          if (sdxl110KvTrip || sdxl110KvRecover) {
            const children = [];
            // if (sdxl110KvTrip) {
            children.push({
              prop: "sdxl110KvTrip",
              label: "累计跳闸",
              align: "center",
              "min-width": "90px",
              render: (h, { row }) => {
                return (
                  <div>
                    {
                      <span
                        style='color:#3561fd;cursor:pointer;text-decoration: underline;'
                        {...{
                          on: {
                            click: () => {
                              this.showShousunDialog("sdxl", "110kV", row.emergencyId, row.unitId);
                            }
                          }
                        }}
                      >
                        {row.sdxl110KvTrip}
                      </span>
                    }
                  </div>
                );
              }
            });
            // }
            // if (sdxl110KvRecover) {
            children.push({
              prop: "sdxl110KvRecover",
              label: "累计恢复",
              align: "center",
              "min-width": "90px"
            });
            // }

            columns[1].children.push(
              {
                label: "110kV",
                align: "center",
                "min-width": "80px",
                children
              });
          }

          // 35
          if (sdxl35KvTrip || sdxl35KvRecover) {
            const children = [];
            // if (sdxl35KvTrip) {
            children.push({
              prop: "sdxl35KvTrip",
              label: "累计跳闸",
              align: "center",
              "min-width": "90px",
              render: (h, { row }) => {
                return (
                  <div>
                    {
                      <span
                        style='color:#3561fd;cursor:pointer;text-decoration: underline;'
                        {...{
                          on: {
                            click: () => {
                              this.showShousunDialog("sdxl", "35kV", row.emergencyId, row.unitId);
                            }
                          }
                        }}
                      >
                        {row.sdxl35KvTrip}
                      </span>
                    }
                  </div>
                );
              }
            });
            // }
            // if (sdxl35KvRecover) {
            children.push({
              prop: "sdxl35KvRecover",
              label: "累计恢复",
              align: "center",
              "min-width": "90px"
            });
            // }
            columns[1].children.push(
              {
                label: "35kV",
                align: "center",
                "min-width": "80px",
                children
              });
          }
        }

        // 变电站
        if (bdz500KvTrip || bdz500KvRecover || bdz220KvTrip || bdz220KvRecover || bdz110KvTrip || bdz110KvRecover || bdz35KvTrip || bdz35KvRecover) {
          columns.push({
            // prop: "",
            label: "变电站",
            align: "center",
            "min-width": "100px",
            children: []
          });
          // 500
          if (bdz500KvTrip || bdz500KvRecover) {
            const children = [];
            // if (bdz500KvTrip) {
            children.push({
              prop: "bdz500KvTrip",
              label: "累计停运",
              align: "center",
              "min-width": "90px",
              render: (h, { row }) => {
                return (
                  <div>
                    {
                      <span
                        style='color:#3561fd;cursor:pointer;text-decoration: underline;'
                        {...{
                          on: {
                            click: () => {
                              this.showShousunDialog("bdz", "500kV", row.emergencyId, row.unitId);
                            }
                          }
                        }}
                      >
                        {row.bdz500KvTrip}
                      </span>
                    }
                  </div>
                );
              }
            });
            // }
            // if (bdz500KvRecover) {
            children.push({
              prop: "bdz500KvRecover",
              label: "累计恢复",
              align: "center",
              "min-width": "90px"
            });
            // }
            columns[columns.length - 1].children.push(
              {
                label: "500kV及以上",
                align: "center",
                "min-width": "120px",
                children
              });
          }
          // 220
          if (bdz220KvTrip || bdz220KvRecover) {
            const children = [];
            // if (bdz220KvTrip) {
            children.push({
              prop: "bdz220KvTrip",
              label: "累计停运",
              align: "center",
              "min-width": "90px",
              render: (h, { row }) => {
                return (
                  <div>
                    {
                      <span
                        style='color:#3561fd;cursor:pointer;text-decoration: underline;'
                        {...{
                          on: {
                            click: () => {
                              this.showShousunDialog("bdz", "220kV", row.emergencyId, row.unitId);
                            }
                          }
                        }}
                      >
                        {row.bdz220KvTrip}
                      </span>
                    }
                  </div>
                );
              }
            });
            // }
            // if (bdz220KvRecover) {
            children.push({
              prop: "bdz220KvRecover",
              label: "累计恢复",
              align: "center",
              "min-width": "90px"
            });
            // }
            columns[columns.length - 1].children.push(
              {
                label: "220kV",
                align: "center",
                "min-width": "120px",
                children
              });
          }

          if (bdz110KvTrip || bdz110KvRecover) {
            const children = [];
            // if (bdz110KvTrip) {
            children.push({
              prop: "bdz110KvTrip",
              label: "累计停运",
              align: "center",
              "min-width": "90px",
              render: (h, { row }) => {
                return (
                  <div>
                    {
                      <span
                        style='color:#3561fd;cursor:pointer;text-decoration: underline;'
                        {...{
                          on: {
                            click: () => {
                              this.showShousunDialog("bdz", "110kV", row.emergencyId, row.unitId);
                            }
                          }
                        }}
                      >
                        {row.bdz110KvTrip}
                      </span>
                    }
                  </div>
                );
              }
            });
            // }
            // if (bdz110KvRecover) {
            children.push({
              prop: "bdz110KvRecover",
              label: "累计恢复",
              align: "center",
              "min-width": "90px"
            });
            // }
            columns[columns.length - 1].children.push(
              {
                label: "110kV",
                align: "center",
                "min-width": "120px",
                children
              });
          }
          if (bdz35KvTrip || bdz35KvRecover) {
            const children = [];
            // if (bdz35KvTrip) {
            children.push({
              prop: "bdz35KvTrip",
              label: "累计停运",
              align: "center",
              "min-width": "90px",
              render: (h, { row }) => {
                return (
                  <div>
                    {
                      <span
                        style='color:#3561fd;cursor:pointer;text-decoration: underline;'
                        {...{
                          on: {
                            click: () => {
                              this.showShousunDialog("bdz", "35kV", row.emergencyId, row.unitId);
                            }
                          }
                        }}
                      >
                        {row.bdz35KvTrip}
                      </span>
                    }
                  </div>
                );
              }
            });
            // }
            // if (bdz35KvRecover) {
            children.push({
              prop: "bdz35KvRecover",
              label: "累计恢复",
              align: "center",
              "min-width": "90px"
            });
            // }
            columns[columns.length - 1].children.push(
              {
                label: "35kV",
                align: "center",
                "min-width": "120px",
                children
              });
          }
        }

        // 配电线路
        if (pdxl10KvTrip || pdxl10KvRecover) {
          const children = [];
          // if (pdxl10KvTrip) {
          children.push({
            prop: "pdxl10KvTrip",
            label: "累计停运",
            align: "center",
            "min-width": "90px",
            render: (h, { row }) => {
              return (
                <div>
                  {
                    <span
                      style='color:#3561fd;cursor:pointer;text-decoration: underline;'
                      {...{
                        on: {
                          click: () => {
                            this.showShousunDialog("pdxl", "10kV", row.emergencyId, row.unitId);
                          }
                        }
                      }}
                    >
                      {row.pdxl10KvTrip}
                    </span>
                  }
                </div>
              );
            }
          });
          // }
          // if (pdxl10KvRecover) {
          children.push({
            prop: "pdxl10KvRecover",
            label: "累计恢复",
            align: "center",
            "min-width": "90px"
          });
          // }
          columns.push({
            label: "配电线路",
            align: "center",
            "min-width": "100px",
            children: [
              {
                label: "10kV",
                align: "center",
                "min-width": "120px",
                children
              }
            ]
          });
        }

        // 台区
        if (tqTrip || tqRecover || tqRater) {
          const children = [];
          // if (tqTrip) {
          children.push({
            prop: "tqTrip",
            label: "累计停电",
            align: "center",
            "min-width": "90px",
            render: (h, { row }) => {
              return (
                <div>
                  {
                    <span
                      style='color:#3561fd;cursor:pointer;text-decoration: underline;'
                      {...{
                        on: {
                          click: () => {
                            this.showShousunDialog("tq", "", row.emergencyId, row.unitId);
                          }
                        }
                      }}
                    >
                      {row.tqTrip}
                    </span>
                  }
                </div>
              );
            }
          });
          // }
          // if (tqRecover) {
          children.push({
            prop: "tqRecover",
            label: "累计恢复",
            align: "center",
            "min-width": "90px"
          });
          // }
          // if (tqRater) {
          children.push({
            prop: "tqRater",
            label: "恢复率",
            align: "center",
            "min-width": "90px",
            formatter: (row, column, cellValue, index) => {
              if (cellValue === null) {
                return 0 + "%";
              } else {
                return cellValue;
              }
            }
          });
          // }
          columns.push({
            label: "台区",
            align: "center",
            "min-width": "100px",
            children: children
          });
        }
        // 用户
        if (ptyhTrip || ptyhRecover || ptyhRater) {
          const children = [];
          // if (ptyhTrip) {
          children.push({
            prop: "ptyhTrip",
            label: "累计停电",
            align: "center",
            "min-width": "90px",
            render: (h, { row }) => {
              return (
                <div>
                  {
                    <span
                      style='color:#3561fd;cursor:pointer;text-decoration: underline;'
                      {...{
                        on: {
                          click: () => {
                            this.showShousunDialog("ptyh", "", row.emergencyId, row.unitId);
                          }
                        }
                      }}
                    >
                      {row.ptyhTrip}
                    </span>
                  }
                </div>
              );
            }
          });
          // }
          // if (ptyhRecover) {
          children.push({
            prop: "ptyhRecover",
            label: "累计恢复",
            align: "center",
            "min-width": "90px"
          });
          // }
          // if (ptyhRater) {
          children.push({
            prop: "ptyhRater",
            label: "恢复率",
            align: "center",
            "min-width": "90px",
            formatter: (row, column, cellValue, index) => {
              if (cellValue === null) {
                return 0 + "%";
              } else {
                return cellValue;
              }
            }
          });
          // }
          columns.push({
            label: "用户",
            align: "center",
            "min-width": "100px",
            children: children
          });
        }
        // 重要用户
        if (zyyhTrip || zyyhRecover || zyyhRater) {
          const children = [];
          // if (zyyhTrip) {
          children.push({
            prop: "zyyhTrip",
            label: "累计停电",
            align: "center",
            "min-width": "90px",
            render: (h, { row }) => {
              return (
                <div>
                  {
                    <span
                      style='color:#3561fd;cursor:pointer;text-decoration: underline;'
                      {...{
                        on: {
                          click: () => {
                            this.showShousunDialog("zyyh", "", row.emergencyId, row.unitId);
                          }
                        }
                      }}
                    >
                      {row.zyyhTrip}
                    </span>
                  }
                </div>
              );
            }
          });
          // }
          // if (zyyhRecover) {
          children.push({
            prop: "zyyhRecover",
            label: "累计恢复",
            align: "center",
            "min-width": "90px"
          });
          // }
          // if (zyyhRater) {
          children.push({
            prop: "zyyhRater",
            label: "恢复率",
            align: "center",
            "min-width": "90px",
            formatter: (row, column, cellValue, index) => {
              if (cellValue === null) {
                return 0 + "%";
              } else {
                return cellValue;
              }
            }
          });
          // }
          columns.push({
            label: "重要用户",
            align: "center",
            "min-width": "100px",
            children: children
          });
        }



        this.disasterInfoConfig.columns = res.length ? columns : zqxx_columns;
        this.disasterInfoConfig.tableData = res.length ? res : [];
      });
    },
    // 获取编辑时应急事件来源
    async getEditSubmitNoJudgeEvent(eventIds) {
      try {
        const res = await getEditSubmitNoJudgeEventApi({ eventIds });
        this.evenFormConfig.formData[0].option = res.map(item => {
          return {
            label: item.emergencyEvent,
            value: item.id,
            ...item
          };
        });


        this.disabledNotSameTypeEvent(res.length ? res[0].id : "");
      } catch (error) {
        console.error(error);
      }
    },
    closeYanpanResDialog() {
      this.dialogConfig1.isShow = false;
    },
    // 受损设备分页切换
    changeShousunTablePageNum(val) {
      this.shousunTablePageNum = val;
      this.getShousunData();
    },
    showShousunDialog(specialtyCode, voltageClasses, emergencyId, unitId) {
      this.shousun_params = {
        pageNum: this.shousunTablePageNum,
        pageSize: 10,
        specialtyCode,
        emergencyId,
        unitId,
        voltageClasses
      };
      this.shousunShow = true;
      this.getShousunData();
    },
    // 获取受损列表数据
    async getShousunData() {
      const res = await getInfoDetailList(this.shousun_params);
      this.shousunTableTotal = res.total;
      this.shousunTable = res.data;
    },
    // 计算分页页数
    calcNum(val) {
      if (val < 10) {
        return 1;
      } else {
        return Math.ceil(val / 10);
      }
    }
  }
};
</script>

<style scoped lang="less">
@import "../../../assets/style/common.less";
@import "../../../assets/style/ComponentStyle.less";
@import "../../../assets/style/pop-upNotification.less";

:deep(.yanpan-jieguo) {
  .el-dialog {
    height: auto !important;
  }

  .el-dialog__body {
    height: 65vh;
    padding-bottom: 20px !important;
  }
}

:deep(.el-tag.el-tag--info) {
  background-color: rgba(185, 206, 250) !important;
  color: #333333 !important;
  border-radius: 0px !important;
  height: 25px;
  font-size: 15px !important;
  border: none !important;
}

:deep(.el-descriptions) {
  font-size: 16px;
}

:deep(::-webkit-scrollbar) {
  height: 12px;
}

:deep(.input_readonly .el-input__inner) {
  padding-left: 0;
}

:deep(.input_readonly .el-textarea__inner) {
  padding-left: 0;
}

:deep(.el-breadcrumb__inner.is-link) {
  font-weight: 100;
  color: #fff;
}

.EmergencyList :deep(.el-breadcrumb__item:last-child .el-breadcrumb__inner) {
  color: #3270ff;
}

:deep(.el-dialog__title) {
  font-weight: bold;
}

:deep(.el-descriptions :not(.is-bordered) .el-descriptions-item__cell) {
  padding-bottom: 29px;
}

// :deep(.shenpi :not(.is-bordered) .el-descriptions-item__cell ) {
//   padding-bottom: 10px;
// }

.box {
  // width: 100%;
  // height: 80vh;
  // padding: 0;
  // margin: 0;
  margin-top: 20px;
  background-color: #fff;
  border-radius: 4px;
  padding: 10px;
  box-sizing: border-box;
}

.to-event-link {
  color: #3270ff;
  text-decoration: underline;
  cursor: pointer;
}

.hide-xing {
  :deep(.el-form-item.is-required:not(.is-no-asterisk) > .el-form-item__label:before) {
    display: none;
  }
}

:deep(.el-descriptions) {
  font-size: 16px;
  padding-top: 10px;
}

:deep(.el-descriptions__body .el-descriptions__table) {
  height: 150px;
}

:deep(.shenpi .el-descriptions__body .el-descriptions__table) {
  height: auto;
}

:deep(.el-select .el-tag__close.el-icon-close) {
  background: none;
  font-size: 18px;
  margin-bottom: 8px;
}

:deep(.el-select .el-tag.el-tag--info .el-tag__close:hover) {
  color: #909399;
}
</style>
